<template>
    <div class="detail-list">
       <div
            class="item"
            v-for="(item,index) in list"
            :key="index"
        >
            <div class="item-title">{{item.title}}</div>

            <div 
                class="item-childen"
                v-if="item.childen">
                <DetailList :list="item.childen"></DetailList>
            </div>
        </div>
    </div>
</template>

<script>

export default {
    name:'DetailList',
    props:{
        list: Array
    }
   
}
</script>

<style lang="stylus" scoped>
   .item-title
        width:100%
        height: .8rem
        line-height: .8rem
        padding:0 .2rem
        border-bottom:0.01rem solid #f5f5f5

    .item-childen
        margin-left:.4rem

</style>